﻿<html xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4">
<link rel="stylesheet" href="../static/css/index.css" th:href="@{/css/index.css}"/>
<head th:replace="common :: head"></head>

<body>
<div id="wrapper">
    <div id="navTop">
        <nav class="navbar navbar-default top-navbar" role="navigation" xmlns:th="http://www.thymeleaf.org"
        >
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".sidebar-collapse">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="/" style="padding:18px 15px;width:378px">
                    <img src="../static/assets/img/logo.png" width="35px" style="float: left;"
                         th:src="@{/assets/img/logo.png}"/>
                    <div style="float: left;width: 300px;margin-left: 12px">车辆GPS管理平台</div>
                </a>
                <div id="sideNav">
                    <i class="fa fa-bars icon"></i>
                </div>
            </div>
            <ul id="activeul" class="nav navbar-top-links navbar-right list">
                <li class="dropdown menuup" id="index">
                    <a class="dropdown-toggle" aria-expanded="false" href="/index">
                        <i class="fa fa-dashboard"></i> <span>首页</span>
                    </a>
                </li>
                <li class="dropdown menuup ">
                    <a class="dropdown-toggle" aria-expanded="false" href="/demo/index/1">
                        <i class="fa fa-envelope fa-fw" class="fa fa-mercury"></i> <span>测试demo</span>
                    </a>
                </li>
                <li class="dropdown">
                    <div class="news" id="messageCount">0</div>
                    <a class="dropdown-toggle" data-toggle="dropdown" href="#" aria-expanded="false">
                        <i class="fa fa-bell fa-fw"></i> <i class="fa fa-caret-down"></i>
                    </a>
                    <ul class="dropdown-menu dropdown-alerts" id="msgBox">
                        <li class="divider"></li>
                        <li>
                            <a class="text-center" href="#" style="color: #aaa"
                               onclick="JumpTo('/message/shortMessage/')">
                                <strong>查看未读消息</strong>
                                <i class="fa fa-angle-right"></i>
                            </a>
                        </li>
                    </ul>
                    <!-- /.dropdown-alerts -->
                </li>
                <li style="color: #fff;
    border-radius: 70px;
    min-width: 50px;
    height: 28px;
    line-height: 28px;
    text-align: center;
    background: #30a5ffd9;
    padding: 0 9px">
                    <span></span>
                    <!--<li class="dropdown">-->
                    <!--<a class="dropdown-toggle menuname" style="padding: 20px 0"-->
                    <!--sec:authentication="principal.name"></a>-->
                    <!--</li>-->
                    <span id="welcome"></span>
                </li>

                <li class="dropdown">
                    <a class="dropdown-toggle" data-toggle="dropdown" href="#" aria-expanded="false">
                        <i class="fa fa-user fa-fw"></i> <i class="fa fa-caret-down"></i>
                    </a>
                    <style>
                        .message:hover {
                            background-color: #1ebfae;
                            color: #ffffff;
                        }

                        .editPassword:hover {
                            background-color: #1ebfae;
                            color: #ffffff;
                        }

                        .address:hover {
                            background-color: #1ebfae;
                            color: #ffffff;
                        }

                        .logout:hover {
                            background-color: #1ebfae;
                            color: #ffffff;
                        }
                    </style>

                    <div class="dropdown-menu dropdown-user" style="min-width: 353px;margin-right: 16px;padding: 0">
                        <div class="row" style="margin-right: 0;margin-left: 0;">
                            <div class="col-md-4 message"
                                 style="padding-top: 5px;text-align: center;height: 50px;cursor: pointer"
                                 data-toggle="modal" data-target="#myModal">
                                <i class="fa fa-address-card-o"
                                   style="padding-top: 5px;display: block;height: 20px;line-height: 20px"></i>
                                <span style="display: block;height: 30px;line-height: 30px">个人信息</span>
                            </div>
                            <div class="col-md-4 editPassword"
                                 style="padding-top: 5px;text-align: center;height: 50px;cursor: pointer"
                                 data-toggle="modal" data-target="#myModall">
                                <i class="fa fa-key" style="display: block;height: 20px;line-height: 20px"></i>
                                <span style="display: block;height: 30px;line-height: 30px"> 修改密码</span>
                            </div>
                            <div class="col-md-4 address"
                                 style="padding-top: 5px;text-align: center;height: 50px;cursor: pointer"
                                 onclick="JumpTo('/addressList/toShow/')">
                                <i class="fa  fa-address-book-o"
                                   style="display: block;height: 20px;line-height: 20px"></i>
                                <span style="display: block;height: 30px;line-height: 30px"> 通讯录</span>
                            </div>
                            <div class="col-md-12 logout"
                                 style="padding-top: 5px;text-align: center;height: 50px;cursor: pointer"
                                 onclick="logout()">
                                <i class="fa fa-sign-out" style="display: block;height: 20px;line-height: 20px"></i>
                                <span style="display: block;height: 30px;line-height: 30px"> 退出</span>
                            </div>
                        </div>
                    </div>
                    <!-- /.dropdown-user -->
                </li>
                <!-- /.dropdown -->

            </ul>

        </nav>
        <div class="modal fade" id="myModal" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                aria-hidden="true">&times;</span>
                        </button>
                        <h4 class="modal-title">个人信息修改</h4>
                    </div>
                    <div class="modal-body" style="min-height: 320px">
                        <form class="form-horizontal" action="" id="defaultForm">
                            <div class="form-group col-md-12">
                                <label class="control-label col-md-3"
                                       style=" line-height: 34px; text-align: right;padding: 0">
                                    姓名：</label>
                                <div class="col-md-9 col-sm-1 col-xs-1" style="margin: 0; padding: 0;">
                                    <p class="form-control" id="updName"></p>
                                </div>
                            </div>
                            <div class="form-group col-md-12">
                                <label class="control-label col-md-3"
                                       style=" line-height: 34px; text-align: right;padding: 0">
                                    性别：</label>
                                <div class="col-md-9 col-sm-1 col-xs-1" style="margin: 0; padding: 0;">
                                    <p class="form-control" id="updSex"></p>
                                </div>
                            </div>
                            <div class="form-group col-md-12">
                                <label class="control-label col-md-3"
                                       style=" line-height: 34px; text-align: right;padding: 0">
                                    职务：</label>
                                <div class="col-md-9 col-sm-1 col-xs-1" style="margin: 0; padding: 0;">
                                    <p class="form-control" id="updDuty"></p>
                                </div>
                            </div>
                            <div id="editMessage" style="display: block">
                                <div class="form-group col-md-12">
                                    <label class="control-label col-md-3"
                                           style=" line-height: 34px; text-align: right;padding: 0">
                                        移动电话：</label>
                                    <div class="col-md-9 col-sm-1 col-xs-1" style="margin: 0; padding: 0;">
                                        <input type="text" class="form-control" id="updMobilephone">
                                    </div>
                                </div>
                                <div class="form-group col-md-12">
                                    <label class="control-label col-md-3"
                                           style=" line-height: 34px; text-align: right;padding: 0">
                                        邮箱：</label>
                                    <div class="col-md-9 col-sm-1 col-xs-1" style="margin: 0; padding: 0;">
                                        <input type="text" class="form-control" id="updMail">
                                    </div>
                                </div>
                                <div class="form-group col-md-12">
                                    <label class="control-label col-md-3"
                                           style=" line-height: 34px; text-align: right;padding: 0">
                                        办公电话：</label>
                                    <div class="col-md-9 col-sm-1 col-xs-1" style="margin: 0; padding: 0;">
                                        <input type="text" class="form-control" id="updTel">
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        <button type="button" class="btn btn-default" id="edit" style="display: inline-block"
                                onclick="updateInformation()">保存
                        </button>
                    </div>


                </div><!-- /.modal-content -->
            </div><!-- /.modal-dialog -->
        </div><!-- /.modal -->
        <div class="modal fade" id="myModall" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                aria-hidden="true">&times;</span>
                        </button>
                        <h4 class="modal-title">密码修改</h4>
                    </div>
                    <div class="modal-body" style="min-height: 227px">
                        <form class="form-horizontal" id="updatePasswordForm">
                            <div class="form-group col-md-12">
                                <label class="control-label col-md-3"
                                       style=" line-height: 34px; text-align: right;padding: 0">
                                    原密码：</label>
                                <div class="col-md-9 col-sm-1 col-xs-1" style="margin: 0; padding: 0;">
                                    <input style="width: 100%" type="password" class="form-control" name="oldPassword"
                                           id="oldPassword"/>
                                </div>
                            </div>
                            <div class="form-group col-md-12">
                                <label class="control-label col-md-3"
                                       style=" line-height: 34px; text-align: right;padding: 0">
                                    新密码：</label>
                                <div class="col-md-9 col-sm-1 col-xs-1" style="margin: 0; padding: 0;">
                                    <input style="width: 100%" type="password" class="form-control" name="newPassword"
                                           id="newPassword"/>
                                </div>
                            </div>
                            <div class="form-group col-md-12">
                                <label class="control-label col-md-3"
                                       style=" line-height: 34px; text-align: right;padding: 0">
                                    确认密码：</label>
                                <div class="col-md-9 col-sm-1 col-xs-1" style="margin: 0; padding: 0;">
                                    <input style="width: 100%" type="password" class="form-control"
                                           name="configPassword"
                                           id="configPassword"/>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        <button type="button" id="updPassWord" class="btn btn-default" onclick="updatePassword()"><i
                                class="fa fa-check"></i>保存
                        </button>
                    </div>


                </div><!-- /.modal-content -->
            </div><!-- /.modal-dialog -->
        </div><!-- /.modal -->
        <script>
            function updatePassword() {
                var serializeJSON = $('#updatePasswordForm').serializeJSON();
                $.ajax({
                    type: 'PUT',
                    url: '/api/password/update',
                    data: JSON.stringify(serializeJSON),
                    contentType: "application/json",
                    success: function (result) {
                        if (result.success) {
                            Showbo.Msg.alert('修改成功');
                            $('#myModall').modal('hide');
                            document.getElementById('updatePasswordForm').reset();
                        } else {
                            Showbo.Msg.alert(result.message);
                        }
                    }

                })

            }

        </script>
    </div>

    <div id="page-wrapper" style="margin-left: 0">
        <div style="width: 60%;margin: 35px 1% 0% 1%;float: left">
            <div style="width: 100%">
                <div class="row state-overview">
                    <div class="col-md-3 col-sm-6">
                        <div class="panel">
                            <div class="symbol terques">
                                <i class="fa fa-paper-plane"></i>
                            </div>
                            <div class="value">
                                <h1 class="count">
                                    0
                                </h1>
                                <p>上报数</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3 col-sm-6">
                        <div class="panel">
                            <div class="symbol red">
                                <i class="fa fa-external-link"></i>
                            </div>
                            <div class="value">
                                <h1 class=" count2">
                                    0
                                </h1>
                                <p>立案数</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3 col-sm-6">
                        <div class="panel">
                            <div class="symbol yellow">
                                <i class="fa fa-calendar-check-o"></i>
                            </div>
                            <div class="value">
                                <h1 class=" count3">
                                    0
                                </h1>
                                <p>结案数</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3 col-sm-6">
                        <div class="panel">
                            <div class="symbol blue">
                                <i class="fa fa-clipboard"></i>
                            </div>
                            <div class="value">
                                <h1 class=" count4">
                                    0
                                </h1>
                                <p>挂起数</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="panel panel-default" style="height: 373px">
                    <div class="panel-body">
                        <div class="col-md-6">
                            <table class="table table-hover ">
                                <thead>
                                <tr>
                                    <th>事件</th>
                                    <th>本周</th>
                                    <th>本月</th>
                                    <th>总数</th>
                                </tr>
                                </thead>
                                <tbody id="eventCount">

                                </tbody>
                            </table>
                        </div>
                        <div class="col-md-6">
                            <table class="table table-hover ">
                                <thead>
                                <tr>
                                    <th>部件</th>
                                    <th>本周</th>
                                    <th>本月</th>
                                    <th>总数</th>
                                </tr>
                                </thead>
                                <tbody id="unitCount">

                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <script>
            $(function () {
                $.get("/api/indexEventCount/count", function (data, status) {
                    var eventStr = "";
                    $(data.data.event).each(function (index, value) {
                        eventStr += "<tr>\n" +
                            "                                    <td>" + value.eventName + "</td>\n" +
                            "                                    <td>" + value.week + "</td>\n" +
                            "                                    <td>" + value.month + "</td>\n" +
                            "                                    <td>" + value.count + "</td>\n" +
                            "                                </tr>";
                    })
                    $("#eventCount").empty();
                    $("#eventCount").append(eventStr);
                    var unitStr = "";
                    $(data.data.unit).each(function (index, value) {
                        unitStr += "<tr>\n" +
                            "                                    <td>" + value.eventName + "</td>\n" +
                            "                                    <td>" + value.week + "</td>\n" +
                            "                                    <td>" + value.month + "</td>\n" +
                            "                                    <td>" + value.count + "</td>\n" +
                            "                                </tr>";
                    })
                    $("#unitCount").empty();
                    $("#unitCount").append(unitStr);

                    countUp(data.data.report);
                    countUp2(data.data.filing);
                    countUp3(data.data.closing);
                    countUp4(data.data.hangUp);
                    $("#empName").text(data.data.empName + "(" + data.data.empArea + ":" + data.data.org + ")");
                    $("#role").text(data.data.role);
                    $("#participate").text(data.data.participate);
                    $("#inOffice").text(data.data.inOffice);
                    $("#close").text(data.data.close);
                    // $("#overtime").text(data.data.overtime);


                    var mychart = echarts.init(document.getElementById("barchart"));
                    var option = {
                        tooltip: {
                            trigger: "axis",
                            show: true
                        },
                        legend: {
                            data: ["蒸发量"]
                        },
                        toolbox: {
                            show: false,
                            feature: {
                                mark: {
                                    show: false
                                },
                                dataView: {
                                    show: false,
                                    readOnly: true
                                },
                                magicType: {
                                    show: false,
                                    type: ["line", "bar"]
                                },
                                restore: {
                                    show: false
                                },
                                saveAsImage: {
                                    show: false
                                },
                                dataZoom: {
                                    show: false
                                }
                            }
                        },
                        calculable: true,
                        xAxis: [
                            {
                                type: "category",
                                data: data.data.area,
                                axisLine: {
                                    lineStyle: {
                                        color: "rgb(255, 255, 255)"
                                    }
                                },
                                axisLabel: {
                                    textStyle: {
                                        fontStyle: "italic",
                                        fontSize: 10
                                    },
                                    rotate:15
                                }
                            }
                        ],
                        yAxis: [
                            {
                                type: "value",
                                axisLine: {
                                    lineStyle: {
                                        color: "rgb(255, 255, 255)"
                                    }
                                }
                            }
                        ],
                        series: [
                            {
                                name: "立案数",
                                type: "bar",
                                data: data.data.areaCount
                            }
                        ],
                        grid: {
                            x: 20,
                            y: 20,
                            x2: 20,
                            y2: 20,
                            backgroundColor: "rgb(169, 217, 108)",
                            borderColor: "rgb(255, 255, 255)"
                        },
                        backgroundColor: "rgb(169, 217, 108)",
                        color: ["rgb(255, 255, 255)", "#87cefa", "#da70d6", "#32cd32", "#6495ed", "#ff69b4", "#ba55d3", "#cd5c5c", "#ffa500", "#40e0d0", "#1e90ff", "#ff6347", "#7b68ee", "#00fa9a", "#ffd700", "#6699FF", "#ff6666", "#3cb371", "#b8860b", "#30e0e0", "#FFFFFF"]
                    }
                    // var option = {
                    //     tooltip: {
                    //         trigger: "axis"
                    //     },
                    //     toolbox: {
                    //         feature: {
                    //             mark: {
                    //                 show: false
                    //             },
                    //             dataView: {
                    //                 show: false,
                    //                 readOnly: true
                    //             },
                    //             magicType: {
                    //                 show: false,
                    //                 type: ["line", "bar"]
                    //             },
                    //             restore: {
                    //                 show: false
                    //             },
                    //             saveAsImage: {
                    //                 show: false
                    //             }
                    //         }
                    //     },
                    //     calculable: true,
                    //     xAxis: [
                    //         {
                    //             type: "category",
                    //             data: data.data.area,
                    //             axisLine: {
                    //                 show: true,
                    //                 lineStyle: {
                    //                     color: "rgb(255, 255, 255)"
                    //                 }
                    //             },
                    //             axisLabel:{interval:0},
                    //             splitLine: {
                    //                 show: false
                    //             },
                    //             axisTick: {
                    //                 show: false
                    //             },
                    //             splitArea: {
                    //                 show: false
                    //             },
                    //             axisLabel: {
                    //                 show: false
                    //             }
                    //         }
                    //     ],
                    //     yAxis: [
                    //         {
                    //             type: "value",
                    //             axisLine: {
                    //                 show: false
                    //             },
                    //             axisLabel: {
                    //                 show: false
                    //             },
                    //             axisTick: {
                    //                 show: false
                    //             },
                    //             splitLine: {
                    //                 show: false
                    //             },
                    //             splitArea: {
                    //                 show: false
                    //             }
                    //         }
                    //     ],
                    //     series: [
                    //         {
                    //             name: "立案数",
                    //             type: "bar",
                    //             data: data.data.areaCount
                    //         }
                    //     ],
                    //     grid: {
                    //         x: 10,
                    //         y: 10,
                    //         x2: 10,
                    //         y2: 10,
                    //         backgroundColor: "rgb(169, 217, 108)"
                    //     },
                    //     backgroundColor: "rgb(169, 217, 108)",
                    //     color: ["rgb(255, 255, 255)", "#87cefa", "#da70d6", "#32cd32", "#6495ed", "#ff69b4", "#ba55d3", "#cd5c5c", "#ffa500", "#40e0d0", "#1e90ff", "#ff6347", "#7b68ee", "#00fa9a", "#ffd700", "#6699FF", "#ff6666", "#3cb371", "#b8860b", "#30e0e0", "#FFFFFF"]
                    // }
                    mychart.setOption(option)


                });

                $.ajax({
                    type: "POST",
                    url: "/api/speicalTask/indexFindCountByEmp",
                    cache: false,  //禁用缓存
                    dataType: "json",
                    success: function (result) {
                        $("#overtime").text(result.data);
                    }
                })


            })


        </script>
        <div style="width: 37%;float: left;margin-top: 35px;">
            <div style="width: 100%">
                <div class="panel panel-default" style="height: 304px">
                    <div class="panel-body">
                        <div class="task-thumb-details">
                            <h1 style="text-align: left">
                                <img src="../static/images/user-icon.png" width="23px"
                                     style="float: left;margin-top: 8px; margin-right: 10px;"
                                     th:src="@{/images/user-icon.png}"/>
                                <span id="empName">Anjelina Joli</span></h1>
                            <p id="role">Senior Architect</p>
                        </div>
                    </div>
                    <table class="table table-hover personal-task">
                        <tbody>
                        <tr onclick="goToTaskAndGoto('/participationTask/')" style="cursor: pointer">
                            <td style="color: #a4aaba;">
                                <i class=" fa fa-calendar-plus-o"></i>
                                参与数
                            </td>
                            <td></td>
                            <td id="participate"> 02</td>
                        </tr>
                        <tr onclick="goToTaskAndGoto('/managing-task/')" style="cursor: pointer">
                            <td style="color: #a4aaba;">
                                <i class="fa fa-reorder"></i>
                                在办数
                            </td>
                            <td></td>
                            <td id="inOffice"> 14</td>
                        </tr>
                        <tr onclick="goToTaskAndGoto('/completed-task/')" style="cursor: pointer">
                            <td style="color: #a4aaba;">
                                <i class="fa fa-calendar-check-o"></i>
                                办结数
                            </td>
                            <td></td>
                            <td id="close"> 45</td>
                        </tr>
                        <tr style="cursor: pointer" onclick="goToTaskAndGoto('/specialTask/')">
                            <td style="color: #a4aaba;">
                                <i class="fa fa-clock-o"></i>
                                专项派遣数
                            </td>
                            <td></td>
                            <td id="overtime"> 09</td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
            <div style="width: 100%">
                <div class="panel green-chart">
                    <div class="panel-body" style="height: 158px">
                        <div class="chart">
                            <div class="heading">
                                <span>区域立案数统计</span>
                            </div>
                            <div id="barchart" style="width: 100%;height: 100px;"></div>
                        </div>
                    </div>

                </div>

            </div>
        </div>

        <div style="width: 60%;float: left;margin: 0% 1% 0% 1%">
            <div style="width: 100%">
                <div class="panel panel-default">
                    <div class="panel-body" style="height: 304px">
                        <li class="wdjx">
                            <img src="../static/assets/img/wait.png" width="16px"
                                 style="float: left;margin-top: 2px;"
                                 th:src="@{/assets/img/wait.png}"/>
                            <a href="#home" data-toggle="tab" style="text-decoration: none;">我的待办</a>
                        </li>
                        <ul class="nav nav-tabs">
                            <!--<li class="active"><a href="#home" data-toggle="tab">我的待办</a>-->
                            <!--</li>-->
                            <li class="active" onclick="chanageLink('pendingTaskLink')"><a href="#pendingTask"
                                                                                           data-toggle="tab"
                                                                                           id="pendingTasktab">全部</a>
                            </li>
                            <li class="" onclick="chanageLink('pendingTaskLink')"><a href="#pengdingtaskSJ "
                                                                                     data-toggle="tab"
                                                                                     id="pendingTaskSJtab">事件</a></li>
                            <li class="" onclick="chanageLink('pendingTaskLink')"><a href="#pengdingtaskBJ "
                                                                                     data-toggle="tab"
                                                                                     id="pendingTaskBJtab">部件</a></li>
                            <!--<li class="" sec:authorize="hasAnyAuthority('a841fd39-ef62-4e99-ba39-6accbcc2f190')" onclick="chanageLink('dscLink')"><a href="#pendingTaskDSC" data-toggle="tab" id="pendingTaskDSCtab">部件</a></li>-->
                            <span class="todo_more">
                                <a id="/pendingTask/" style="display: block;cursor: pointer"
                                   onclick="goToTaskAndGoto('/pendingTask/')">更多>></a>
                                <!--<a id="dscLink" style="display: none;" href="/examination/">更多>></a>-->
                            </span>
                        </ul>

                        <div class="tab-content">
                            <div class="tab-pane fade active in" id="pendingTask">
                                <div class="todo_list">
                                </div>
                            </div>
                            <div class="tab-pane fade" id="pengdingtaskSJ">
                            </div>
                            <div class="tab-pane fade" id="pengdingtaskBJ">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div style="width: 100%">
                <div class="panel panel-default">
                    <div class="panel-body" style="height: 290px">
                        <li class="wdjx">
                            <img src="../static/assets/img/notes.png" width="16px"
                                 style="float: left;margin-top: 2px;"
                                 th:src="@{/assets/img/notes.png}"/>
                            <div data-toggle="tab" style="color: #337ab7">我的待阅</div>
                        </li>
                        <ul class="nav nav-tabs">

                            <li class="active"><a href="#noR" data-toggle="tab" id="noVtav">待阅</a>
                            </li>
                            <li class=""><a href="#IsR" data-toggle="tab" id="IsRtav">已读</a>
                            </li>
                            <input hidden id="jobSendKey" value="0">
                            <a class="todo_more" style="cursor: pointer" onclick="goToTaskAndGoto('/toTaskCirculate')">更多>></a>
                        </ul>
                        <div class="tab-content">
                            <div class="tab-pane fade active in" id="noR">
                                <div class="todo_list">
                                </div>
                            </div>
                            <div class="tab-pane fade" id="IsR">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="" style="width: 37%;float: left;margin-top: 0%;">
            <div class="panel panel-default">
                <div class="panel-body">
                    <div class="zcwj">
                        <div class="zcwj_head">
                            <ul class="zcwj_ul">
                                <li class="zcwj_icon"></li>
                                <li class="zcwj_title">政策文件</li>
                                <li class="zcwj_more"><a onclick="goToSystemAndGoto('/policy/')"
                                                         style="cursor: pointer">更多>></a></li>
                            </ul>
                        </div>
                        <div class="zcwj_body" id="zcwj_body">
                            <!--<div class="zcwj_list">-->
                            <!--<p>街道是城市居民生活的地域共同体，是城市的基础细胞，是基层的战斗堡垒。我区坚持推动重心下移、力量下沉，把街道管理体制机制改革试点全</p>-->
                            <!--<div class="zcwj_time"><span style="color: #337ab7">【新闻通知】</span><span>2019-01-22 15:30</span></div>-->
                            <!--</div>-->
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
</div>
</body>
<script th:inline="javascript">

    $(function () {
        /*查询登录人*/
        ;
        /*查询政策文件*/
        getPolicy();
        //获取待办
        getPendingTaskAll();
        getPendingTaskBJ();
        getPendingTaskSJ();
        getPendingReadNoR();
        getPendingReadIsR();
        //获取待办

    })

    function ReadMessageAndGotoTaskAndGoto(taskCirculateId, e) {
        $.ajax({
            type: "POST",
            url: "/api/taskCirculate/readTask",
            cache: false,  //禁用缓存
            data: {"taskCirculateId": taskCirculateId},  //传入组装的参数
            dataType: "json",
            success: function (result) {
                goToLayout('m1003');
                goTo(e);
            }
        })
    }

    function goToTaskAndGoto(e) {//跳转到事件处置
        goToLayout('m1003');
        goTo(e);
    }

    function goToSystemAndGoto(e) {
        goToLayout('m1001');
        goTo(e);
    }

    function getPendingReadNoR() {
        $.ajax({
            type: "get",
            url: "/api/taskCirculate/findTaskCirculateByPageForIndex/5/1",//传入页码跟事件id
            cache: false,  //禁用缓存
            success: function (result) {
                //封装返回数据
                var html = "";
                $.each(result.data.taskCirculatePage, function (index, item) {
                    var title = "";
                    if (item.task.remark.length > 45) {
                        title = item.task.remark.substr(0, 45) + "...";
                    } else {
                        title = item.task.remark;
                    }
                    html += "<ul class='todo_ul'><li class='todo_class'>未阅</li>" +
                        "<li class='todo_title' style='cursor: pointer'><a onclick=\"ReadMessageAndGotoTaskAndGoto('" + item.taskCirculateId + "','/toTaskInfo/" + item.task.id + "')\" >" + title + "</a></li><li class='todo_name'>【" + item.task.status + "】</li><li class='todo_time'>" + item.cdate + "</li>" +
                        "</ul>"
                })
                $("#noR").empty();
                $("#noR").append(html);
                $("#noVtav").text("待阅（" + result.data.taskCirculatePageSize + ")");
            }
        });
        /*$.ajax({
            type: "get",
            url: "/api/message/findMessageByPage/5/0",//传入页码跟事件id
            cache: false,  //禁用缓存
            success: function (result) {
                //封装返回数据
                // console.log(result.data);
                var html = "";
                $.each(result.data.messagePage, function (index, item) {
                    var title = "";
                    console.log(item);
                    if (item.title.length > 45) {
                        title = item.title.substr(0, 45) + "...";
                    } else {
                        title = item.title;
                    }
                    html += "<ul class='todo_ul'><li class='todo_class'>未阅</li>" +
                        "<li class='todo_title2'><a onclick=\"goToSystemAndGoto('/message')\" >" + title + "</a></li><li class='todo_time'>" + item.cdate + "</li>" +
                        "</ul>"
                })
                $("#noR").empty();
                $("#noR").append(html);
                $("#noVtav").text("未阅（" + result.data.messagePageSize + ")");
            }
        });*/
    }

    function getPendingReadIsR() {
        $.ajax({
            type: "get",
            url: "/api/taskCirculate/findTaskCirculateByPageForIndex/5/0",//传入页码跟部件id
            cache: false,  //禁用缓存
            success: function (result) {
                //封装返回数据
                var html = "";
                $.each(result.data.taskCirculatePage, function (index, item) {
                    var title = "";
                    if (item.task.remark.length > 45) {
                        title = item.task.remark.substr(0, 45) + "...";
                    } else {
                        title = item.task.remark;
                    }
                    html += "<ul class='todo_ul'><li class='todo_class2'>已阅</li>" +
                        "<li class='todo_title' style='cursor: pointer'><a onclick=\"goToTaskAndGoto('/toTaskInfo/" + item.task.id + "')\" >" + title + "</a></li><li class='todo_name'>【" + item.task.status + "】</li><li class='todo_time'>" + item.cdate + "</li>" +
                        "</ul>"
                })
                $("#IsR").empty();
                $("#IsR").append(html);
                $("#IsRtav").text("已阅（" + result.data.taskCirculatePageSize + ")");
            }
        });
        /*$.ajax({
            type: "get",
            url: "/api/message/findMessageByPage/5/1",//传入页码跟部件id
            cache: false,  //禁用缓存
            success: function (result) {
                //封装返回数据
                console.log(result.data);
                var html = "";
                $.each(result.data.messagePage, function (index, item) {
                    var title = "";
                    if (item.title.length > 45) {
                        title = item.title.substr(0, 45) + "...";
                    } else {
                        title = item.title;
                    }
                    html += "<ul class='todo_ul'><li class='todo_class2'>已阅</li>" +
                        "<li class='todo_title2'><a onclick=\"goToSystemAndGoto('/message')\" >" + title + "</a></li><li class='todo_time'>" + item.cdate + "</li>" +
                        "</ul>"
                })
                $("#IsR").empty();
                $("#IsR").append(html);
                $("#IsRtav").text("已阅（" + result.data.messagePageSize + ")");
            }
        });*/
    }


    /*政策文件列表数据显示方法*/
    function getPolicy() {
        $.ajax({
            type: "get",
            url: "/api/policy/getPolicyList/6",
            cache: false,  //禁用缓存
            success: function (result) {
                //封装返回数据
                // console.log(result);
                var html = "";
                $.each(result, function (index, item) {
                    var title = "";
                    if (item.title.length > 65) {
                        title = item.title.substr(0, 65) + "...";
                    } else {
                        title = item.title;
                    }
                    html += "<div class='zcwj_list'><p><a style='color: #337ab7 ;cursor: pointer' onclick='goToSystemAndGoto(\"/policy/toShowpolicy/" + item.policyId + "\")' title='" + item.title + "'>" + title + "</p><div class='zcwj_time'><span style='color: #555'>《" + item.policyType.kvValue + "》</span><span style='color: #555'>" + item.cdate + "</span></div></div>"
                })
                $("#zcwj_body").empty();
                $("#zcwj_body").append(html);
            }
        });
    }

    function chanageLink(showId) {
        if (showId == 'pendingTaskLink') {
            $("#pendingTaskLink").show();
            $("#dscLink").hide();
        } else {
            $("#dscLink").show();
            $("#pendingTaskLink").hide();
        }
    }

    /*待办事件列表数据显示方法*/
    function getPendingTaskAll() {
        $.ajax({
            type: "get",
            url: "/api/backlog/findTaskBy/5/all",
            cache: false,  //禁用缓存
            success: function (result) {
                //封装返回数据
                // console.log(result.taskList);
                // console.log(result.taskListSize);
                var html = "";
                $.each(result.taskList, function (index, item) {
                    var title = ""
                    // console.log(item);
                    if (item.remark.length > 45) {
                        title = item.remark.substr(0, 45) + "...";
                    } else {
                        title = item.remark;
                    }

                    var className = "";
                    var typename = "";
                    if (item.taskTypeId.indexOf(',01,') >= 0) {
                        //判断是否是部件
                        className = "todo_class2";
                        typename = "部件";
                    } else {
                        className = "todo_class";
                        typename = "事件";
                    }
                    html += "<ul class='todo_ul'><li class='" + className + "'>" + typename + "</li>" +
                        "<li class='todo_title' style='cursor: pointer'><a onclick=\"goToTaskAndGoto('/pendingTask/'+'" + item.id + "')\" >" + title + "</a></li><li class='todo_name'>【" + item.taskTypeDetailID + "】</li><li class='todo_time'>" + item.cdate + "</li>" +
                        "</ul>";

                })
                $("#pendingTask").empty();
                $("#pendingTask").append(html);
                $("#pendingTasktab").text("全部（" + result.taskListSize + ")");

            }
        });
    }

    function getPendingTaskSJ() {
        $.ajax({
            type: "get",
            url: "/api/backlog/findTaskBy/5/02",//传入页码跟事件id
            cache: false,  //禁用缓存
            success: function (result) {
                //封装返回数据
                // console.log(result);
                var html = "";
                $.each(result.taskList, function (index, item) {
                    var title = "";
                    if (item.remark.length > 45) {
                        title = item.remark.substr(0, 45) + "...";
                    } else {
                        title = item.remark;
                    }
                    html += "<ul class='todo_ul'><li class='todo_class'>事件</li>" +
                        "<li class='todo_title' style='cursor: pointer'><a onclick=\"goToTaskAndGoto('/pendingTask/'+'" + item.id + "')\">" + title + "</a></li><li class='todo_name'>【" + item.taskTypeDetailID + "】</li><li class='todo_time'>" + item.cdate + "</li>" +
                        "</ul>"
                })
                $("#pengdingtaskSJ").empty();
                $("#pengdingtaskSJ").append(html);
                $("#pendingTaskSJtab").text("事件（" + result.taskListSize + ")");
            }
        });
    }

    function getPendingTaskBJ() {
        $.ajax({
            type: "get",
            url: "/api/backlog/findTaskBy/5/01",//传入页码跟部件id
            cache: false,  //禁用缓存
            success: function (result) {
                //封装返回数据
                // console.log(result);
                var html = "";
                $.each(result.taskList, function (index, item) {
                    var title = "";
                    if (item.remark.length > 45) {
                        title = item.remark.substr(0, 45) + "...";
                    } else {
                        title = item.remark;
                    }
                    html += "<ul class='todo_ul'><li class='todo_class2'>部件</li>" +
                        "<li class='todo_title' style='cursor: pointer'><a onclick=\"goToTaskAndGoto('/pendingTask/'+'" + item.id + "')\"  >" + title + "</a></li><li class='todo_name'>【" + item.taskTypeDetailID + "】</li><li class='todo_time'>" + item.cdate + "</li>" +
                        "</ul>"
                })
                $("#pengdingtaskBJ").empty();
                $("#pengdingtaskBJ").append(html);
                $("#pendingTaskBJtab").text("部件（" + result.taskListSize + ")");
            }
        });
    }


    function countUp(count) {
        var div_by = 100,
            speed = Math.round(count / div_by),
            $display = $('.count'),
            run_count = 1,
            int_speed = 24;

        var int = setInterval(function () {
            if (run_count < div_by) {
                $display.text(speed * run_count);
                run_count++;
            } else if (parseInt($display.text()) < count) {
                var curr_count = parseInt($display.text()) + 1;
                $display.text(curr_count);
            } else {
                clearInterval(int);
            }
        }, int_speed);
    }


    function countUp2(count) {
        var div_by = 100,
            speed = Math.round(count / div_by),
            $display = $('.count2'),
            run_count = 1,
            int_speed = 24;

        var int = setInterval(function () {
            if (run_count < div_by) {
                $display.text(speed * run_count);
                run_count++;
            } else if (parseInt($display.text()) < count) {
                var curr_count = parseInt($display.text()) + 1;
                $display.text(curr_count);
            } else {
                clearInterval(int);
            }
        }, int_speed);
    }


    function countUp3(count) {
        var div_by = 100,
            speed = Math.round(count / div_by),
            $display = $('.count3'),
            run_count = 1,
            int_speed = 24;

        var int = setInterval(function () {
            if (run_count < div_by) {
                $display.text(speed * run_count);
                run_count++;
            } else if (parseInt($display.text()) < count) {
                var curr_count = parseInt($display.text()) + 1;
                $display.text(curr_count);
            } else {
                clearInterval(int);
            }
        }, int_speed);
    }


    function countUp4(count) {
        var div_by = 100,
            speed = Math.round(count / div_by),
            $display = $('.count4'),
            run_count = 1,
            int_speed = 24;

        var int = setInterval(function () {
            if (run_count < div_by) {
                $display.text(speed * run_count);
                run_count++;
            } else if (parseInt($display.text()) < count) {
                var curr_count = parseInt($display.text()) + 1;
                $display.text(curr_count);
            } else {
                clearInterval(int);
            }
        }, int_speed);
    }


    // if ($("body").width() > 1366) {
    //     $("#barchart").sparkline([5, 3, 6, 7, 5, 6, 4, 2, 3, 4, 6, 8, 9, 10, 8, 6, 5, 7, 6, 5, 4, 7, 4], {
    //         type: 'bar',
    //         // width:"470",
    //         height: '65',
    //         barWidth: 24.5,
    //         barSpacing: 5,
    //         barColor: '#fff'
    //         // tooltipFormat: '<span style="display:block; padding:0px 10px 12px 0px;">' +
    //         //     '<span style="color: {{color}}">&#9679;</span> {{offset:names}} ({{percent.1}}%)</span>'
    //
    //     });
    // } else {
    //     $("#barchart").sparkline([5, 3, 6, 7, 5, 6, 4, 2, 3, 4, 6, 8, 9, 10, 8, 6, 5, 7, 6, 5, 4, 7, 4], {
    //         type: 'bar',
    //         // width:"470",
    //         height: '65',
    //         barWidth: 15.7,
    //         barSpacing: 5,
    //         barColor: '#fff'
    //         // tooltipFormat: '<span style="display:block; padding:0px 10px 12px 0px;">' +
    //         //     '<span style="color: {{color}}">&#9679;</span> {{offset:names}} ({{percent.1}}%)</span>'
    //
    //     });
    //
    // }
</script>
</html>